import React from 'react';
import { useThemeStore } from '../../stores/themeStore';
import { getTheme } from '../../theme/config';

interface CustomMenuDividerProps {
  className?: string;
  style?: React.CSSProperties;
}

const CustomMenuDivider: React.FC<CustomMenuDividerProps> = ({
  className = '',
  style = {}
}) => {
  const { mode } = useThemeStore();
  const theme = getTheme(mode);

  return (
    <div
      className={`custom-menu-divider ${className}`}
      style={{
        height: '1px',
        backgroundColor: theme.dropdownBorderColor,
        margin: '8px 0',
        ...style
      }}
    />
  );
};

export default CustomMenuDivider;